<template>
	<view class="container">
		<view class="header">
			<view class="" :style="'height:'+barHeight+'px'">

			</view>
			<view class="align-center plr12 justify-between " :style="'height: 70rpx;padding-right:260rpx'">
				<view class="align-center">
					<image src="../../static/images/dw2.png" style="width: 48rpx;height: 48rpx;" mode=""></image>
					福建省
				</view>
				<navigator url="/pages/messagelist/index" hover-class="none" class="posRelative "
					style="margin-right: 4rpx;">
					<image src="../../static/images/mes.png" style="width: 48rpx;height: 48rpx;" mode=""></image>
					<text class="posAbsort mes">1</text>
				</navigator>
			</view>
			<view class="tabs">
				<uv-tabs :list="list" lineColor="#fff" :activeStyle="{
			color: '#fff',
			fontWeight: 'bold',
			transform: 'scale(1.05)'
    	}" :inactiveStyle="{
			color: '#fff',
			transform: 'scale(1)',
			fontSize:'14px'
		}" @click="click"></uv-tabs>

			</view>
		</view>
		<view class="" style="height: 260rpx;">

		</view>
		<view class="bgWhite plr15 ptb10 ">
			<view class="search align-center mb10">
				<uv-input class="flex1" placeholder="请输入您要搜索的公司" border="none"></uv-input>
				<navigator url="/pages/company/index" hover-class="none" class="searchicon align-center justify-center">
					<uv-icon name="search" color="#fff" size="20"></uv-icon>
				</navigator>
			</view>

			<uv-swiper height="185" :list="list1"></uv-swiper>
			<view class="tabs mt10 align-center justify-between">
				<view :class="tabact==0?'act':''" @click="tabact=0">
					行业快讯
				</view>
				<view :class="tabact==1?'act':''" @click="tabact=1">
					政策法规
				</view>
			</view>
			<view class="newsList">
				<navigator url="/pages/noticeMain/index" hover-class="none" class="news">
					<view class="">
						新闻名称新闻名称新闻名称新闻名称新闻名称新闻名称新闻名称
					</view>
					<text>新闻名称新闻名称新闻名称新闻名称新闻名称新闻名称新闻名称</text>
					<text class="time">2122</text>
				</navigator>
			</view>
		</view>
		<customTab :active="0"></customTab>
	</view>
</template>

<script>
	let app = getApp();
	import customTab from '../../components/customTab.vue';
	export default {
		components: {
			customTab
		},
		data() {
			return {
				act: 0,
				dataInfo: {},
				reportNum: '',
				keyWord: "",
				barHeight: 0,
				list: [{
					name: '关注',
				}, {
					name: '推荐',
				}, {
					name: '电影'
				}, {
					name: '科技'
				}, {
					name: '音乐'
				}, {
					name: '美食'
				}, {
					name: '文化'
				}, {
					name: '财经'
				}, {
					name: '手工'
				}],
				list1: [
					'https://cdn.uviewui.com/uview/swiper/swiper1.png',
					'https://cdn.uviewui.com/uview/swiper/swiper2.png',
					'https://cdn.uviewui.com/uview/swiper/swiper3.png',
				],
				tabact: 0,
				plmenu: 0
			}
		},
		onLoad(opt) {


		},
		onShow() {
			uni.hideTabBar()
			this.plmenu = uni.getStorageSync('menuInfo').menuWidth + uni.getStorageSync('menuInfo').menuRight
			this.barHeight = uni.getStorageSync('menuInfo').menuTop
		},
		mounted() {


		},

		methods: {

			click(item) {
				console.log('item', item);
			}
		}





	}
</script>
<style scoped lang="scss">
	.header {
		background-color: #228CFC;
		color: #fff;
		position: fixed;
		top: 0;
		left: 0;
		width: 100%;

		.mes {
			background-color: #D54941;
			color: #fff;
			width: 32rpx;
			height: 32rpx;
			text-align: center;
			line-height: 32rpx;
			top: -16rpx;
			right: -16rpx;
			border-radius: 50%;
			font-size: 20rpx;
		}
	}

	.search {
		border: 1px solid #228CFC;
		border-radius: 60rpx;
		height: 76rpx;
		padding: 0 10rpx 0 30rpx;

		.searchicon {
			background-color: #228CFC;
			width: 96rpx;
			height: 60rpx;
			border-radius: 60rpx;
			text-align: center;
		}
	}

	.tabs {
		height: 96rpx;
		font-size: 28rpx;
		color: #000;

		view {
			flex: 1;
			text-align: center;

		}

		.act {
			color: #228CFC;
			position: relative;
		}

		.act::before {
			clear: both;
			content: '';
			position: absolute;
			left: 0;
			right: 0;
			margin: auto;
			bottom: -40rpx;
			width: 32rpx;
			height: 6rpx;
			border-radius: 6rpx;
			background-color: #228CFC;
		}
	}

	.news {
		font-size: 32rpx;
		color: #000;
		margin-top: 32rpx;
		padding-bottom: 32rpx;
		border-bottom: 2rpx solid rgba(243, 243, 243, 1);
		line-height: 44rpx;

		text {
			font-size: 26rpx;
			color: rgba(0, 0, 0, 0.6);
			display: block;
		}

		.time {
			color: rgba(0, 0, 0, 0.4);
			font-size: 20rpx;
		}
	}
</style>